<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width"/>
  <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  <title>支分宝</title>
  <link rel="stylesheet" type="text/css" href="/static/admin/jingtaiwu/api.css"/>
  <link rel="stylesheet" type="text/css" href="/static/admin/jingtaiwu/aui.css"/>
  <link rel="stylesheet" type="text/css" href="/static/admin/jingtaiwu/swiper.min.css"/>
  <style>
    html, body {
      width: 100%;
      height: 100%;
      background: #EBEBEB;
    }

    #swiper-container.swiper-container .swiper-slide img {
      width: 100%;
    }

    #swiper-container.swiper-container .swiper-pagination-bullet {
      width: 0.6rem;
      height: 0.6rem;
      background: rgba(255, 255, 255, 0.7);
      opacity: 0.7;
      border-radius: 50%;
    }

    #swiper-container.swiper-container .swiper-pagination-bullet-active {
      background: #ffffff;
      opacity: 1;
    }

    .btn-group {
      padding: 0.5rem 0.8rem;
      font-weight: 500;
    }

    .btn-group .btn-top {
      display: flex;
      align-items: center;
    }

    .btn-group .btn-top .item {
      flex: 1;
      height: 4.3rem;
      border-radius: 0.25rem;
      padding-left: 0.65rem;
    }

    .btn-group .btn-top .item:first-child {
      margin-right: 0.55rem;
    }

    .btn-group .btn-top .item .title {
      color: #454647;
      font-size: 0.7rem;
      margin-top: 0.525rem;
    }

    .btn-group .btn-top .item .sub-title {
      color: #706D6D;
      font-size: 0.5rem;
    }

    .btn-group .btn-top .item .name {
      position: relative;
      display: inline-block;
      color: #454647;
      font-size: 0.5rem;
      padding-bottom: 0.1rem;
      border: none;
      background-size: 100% 1px;
      background-repeat: no-repeat;
      background-position: bottom;
      background-image: linear-gradient(0, #454647, #454647 50%, transparent 50%);
      background-image: -webkit-linear-gradient(90deg, #454647, #454647 50%, transparent 50%);
    }

    .btn-group .btn-top .item .name .icon-red {
      position: absolute;
      top: 50%;
      right: -0.425rem;
      transform: translateY(-50%);
      width: 0.275rem;
      height: 0.275rem;
      background: radial-gradient(circle, #fc020d, #c54747);
      border-radius: 50%;
    }

    .btn-group .btn-top .item.item1 {
      background: linear-gradient(236deg, #86bb8d, #becdb6);
      position: relative;
    }

    .btn-group .btn-top .item.item1 .icon-hot {
      position: absolute;
      top: 0;
      right: 0;
      width: 1.7rem;
      height: 1.625rem;
      background: url("/static/admin/jingtaiwu/main1/hot.png") center center no-repeat;
      background-size: 100%;
    }

    .btn-group .btn-top .item.item1 .img1 {
      position: absolute;
      bottom: 0;
      right: 0.175rem;
      width: 4rem;
      height: 1.625rem;
      z-index: 1;
    }

    .btn-group .btn-top .item.item1 .img2 {
      position: absolute;
      bottom: 0.325rem;
      right: 0;
      width: 3.15rem;
      height: 2.55rem;
    }

    .btn-group .btn-top .item.item2 {
      background: linear-gradient(236deg, #f0a144, #fec56e);
      position: relative;
    }

    .btn-group .btn-top .item.item2 .img3 {
      position: absolute;
      bottom: -0.175rem;
      right: 0;
      width: 2.85rem;
      height: 2.3rem;
    }

    .btn-group .btn-bottom {
      display: flex;
      align-items: center;
      border-radius: 0.2rem;
      margin-top: 0.45rem;
    }

    .btn-group .btn-bottom .item {
      flex: 1;
      height: 3.7rem;
      display: flex;
      flex-flow: column;
      align-items: center;
      padding-top: 0.45rem;
      justify-content: space-between;
    }

    .btn-group .btn-bottom .item:nth-child(3n+1),
    .btn-group .btn-bottom .item:nth-child(3n+2) {
      margin-right: 0.65rem;
    }

    .btn-group .btn-bottom .item .title {
      color: #2E4E56;
      font-size: 0.7rem;
    }

    .btn-group .btn-bottom .item .sub-title {
      color: #2E4E56;
      font-size: 0.5rem;
      border: none;
      background-size: 100% 1px;
      background-repeat: no-repeat;
      background-position: bottom;
      background-image: linear-gradient(0, #2E4E56, #2E4E56 50%, transparent 50%);
      background-image: -webkit-linear-gradient(90deg, #2E4E56, #2E4E56 50%, transparent 50%);
    }

    .btn-group .btn-bottom .item .img4 {
      width: 1.2rem;
      height: 1.2rem;
    }

    .btn-group .btn-bottom .item .img5 {
      width: 2.55rem;
      height: 1.2rem;
    }

    .btn-group .btn-bottom .item .img6 {
      width: 1.325rem;
      height: 1.275rem;
    }

    .btn-group .btn-bottom .item.item3 {
      background: #C4D1D7;
    }

    .btn-group .btn-bottom .item.item4 {
      background: #E6D7AE;
    }

    .btn-group .btn-bottom .item.item5 {
      background: #CCDDE5;
    }

    .banner {
      height: 2.775rem;
      background: #ffffff;
      margin: 0 0.8rem;
      margin-bottom: 0.5rem;
      border-radius: 0.25rem;
      padding-left: 0.675rem;
      font-weight: 500;
    }

    .banner .swiper-slide {
      display: flex;
      align-items: center;
    }

    .banner .swiper-slide .left {
      color: #FD6D3A;
      font-size: 0.6rem;
      margin-right: 0.25rem;
    }

    .banner .swiper-slide .info {
      display: flex;
      align-items: center;
    }

    .banner .swiper-slide .info .avatar {
      width: 1.45rem;
      height: 1.45rem;
      border-radius: 50%;
    }

    .banner .swiper-slide .info .main {
      display: flex;
      flex-flow: column;
      justify-content: space-between;
      margin-left: 0.225rem;
    }

    .banner .swiper-slide .info .main .name {
      color: #454647;
      font-size: 0.6rem;
    }

    .banner .swiper-slide .info .main .event {
      color: #454647;
      font-size: 0.6rem;
    }

    .banner .swiper-slide .info .main .event .highlight {
      color: #F85959;
    }

    .product-list {
      padding: 1.05rem 0.5rem 0 0.575rem;
      background: white;
      margin: 0 0.8rem;
      border-radius: 0.25rem;
      font-weight: 500;
      margin-bottom: 0.5rem;
    }

    .product-list .title-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 0.625rem;
    }

    .product-list .title-bar .left {
      display: flex;
      align-items: center;
    }

    .product-list .title-bar .left .index {
      color: #999999;
      font-size: 0.7rem;
    }

    .product-list .title-bar .left .hr {
      display: inline-block;
      height: 0.825rem;
      width: 1px;
      background: #999999;
      transform: scaleX(0.5);
    }

    .product-list .title-bar .left .name {
      color: #454647;
      font-size: 0.7rem;
    }

    .product-list .title-bar .right {
      display: flex;
      align-items: center;
      color: #999999;
      font-size: 0.7rem;
    }

    .product-list .title-bar .right .icon-right {
      width: 0.4rem;
      height: 0.425rem;
      background: url("/static/admin/jingtaiwu/main1/right.png") center center no-repeat;
      background-size: 100%;
      margin-left: 0.225rem;
    }

    .product-list .list:after {
      content: '';
      height: 0;
      display: block;
      clear: both;
    }

    .product-list .list .item {
      width: calc(50% - 0.166rem);
      padding-bottom: 1.275rem;
    }

    .product-list .list .item .product-img {
      width: 100%;
      height: 6.1rem;
      object-fit: cover;
    }

    .product-list .list .item .price {
      color: #F85959;
      font-size: 0.6rem;
      margin-top: 0.425rem;
      text-align: center;
    }

    .product-list .list .item .desc {
      color: #454647;
      font-size: 0.6rem;
      text-align: center;
    }

    .product-list .list .item:nth-child(2n+1) {
      clear: left;
      float: left;
    }

    .product-list .list .item:nth-child(2n) {
      float: right;
    }

    .product-list .list2:after {
      content: '';
      height: 0;
      display: block;
      clear: both;
    }

    .product-list .list2 .item {
      width: calc(33.3% - 0.166rem);
      padding-bottom: 0.925rem;
      margin-right: 0.166rem;
      float: left;
    }

    .product-list .list2 .item .product-img {
      width: 100%;
      height: 6.1rem;
      object-fit: cover;
    }

    .product-list .list2 .item .price {
      color: #F85959;
      font-size: 0.6rem;
      margin-top: 0.425rem;
      text-align: center;
    }

    .product-list .list2 .item .desc {
      color: #454647;
      font-size: 0.6rem;
      text-align: center;
      padding: 0 0.1rem;
    }

    .product-list .list3 .item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-top: 0.65rem;
      padding-bottom: 0.65rem;
    }

    .product-list .list3 .item .product-img {
      width: 3.025rem;
      height: 3.025rem;
    }

    .product-list .list3 .item .info {
      flex: 1;
      padding-top: 0.3rem;
      padding-bottom: 0.35rem;
      display: flex;
      flex-flow: column;
      justify-content: space-between;
      height: 3.025rem;
      margin-left: 0.4rem;
    }

    .product-list .list3 .item .info .price {
      color: #454647;
      font-size: 0.7rem;
    }

    .product-list .list3 .item .info .desc {
      color: #999999;
      font-size: 0.6rem;
    }

    .product-list .list3 .item .right {
      width: 4rem;
      height: 3.025rem;
      display: flex;
      flex-flow: column;
      justify-content: space-between;
      padding-top: 0.025rem;
      padding-bottom: 0.3rem;
    }

    .product-list .list3 .item .right .top {
      display: flex;
      align-items: center;
      color: #999999;
      font-size: 0.6rem;
    }

    .product-list .list3 .item .right .top img {
      width: 0.7rem;
      height: 0.925rem;
      margin-right: 0.275rem;
    }

    .product-list .list3 .item .right .btn {
      width: 2.8rem;
      height: 1.025rem;
      line-height: 1.025rem;
      border-radius: 5.0125rem;
      text-align: center;
      color: #FFFFFF;
      font-size: 0.5rem;
      background: linear-gradient(28deg, #f96b47, #ff762b);
    }

    .scroll-ad {
      margin-left: 0.8rem;
      height: 5.35rem;
      overflow-x: scroll;
      margin-bottom: 0.55rem;
    }

    .scroll-ad .scroll-area {
      width: 500%;
    }

    .scroll-ad .scroll-area .scroll-item {
      display: inline-block;
      min-height: 5.35rem;
      margin-right: 0.525rem;
      background: #ffffff;
      box-shadow: 0 0 6px 2px rgba(9, 2, 4, 0.1);
      padding: 0.25rem 0.5rem 0 0.425rem;
      border-radius: 0.25rem;
      position: relative;
    }

    .scroll-ad .scroll-area .scroll-item:first-child {
      border: 1px solid #f78156;
    }

    .scroll-ad .scroll-area .scroll-item .product-img {
      width: 100%;
      height: 2.85rem;
      object-fit: cover;
    }

    .scroll-ad .scroll-area .scroll-item .badge {
      position: absolute;
      top: 0;
      left: 0;
      width: 2.2rem;
      height: 0.65rem;
    }

    .scroll-ad .scroll-area .scroll-item .title {
      text-align: right;
      color: #999999;
      font-size: 0.45rem;
    }

    .scroll-ad .scroll-area .scroll-item .price {
      color: #454647;
      font-size: 0.5rem;
      line-height: 0.6rem;
    }

    .scroll-ad .scroll-area .scroll-item .desc {
      color: #454647;
      font-size: 0.5rem;
      line-height: 0.6rem;
    }

    .scroll {
      padding-left: 0.8rem;
      /*overflow-x: scroll;*/
      overflow-y: hidden;
      margin-bottom: 0.2rem;
      white-space: nowrap;
    }

    .scroll-area {
      width: 100%;
      display: flex;
      align-items: center;
      flex-wrap: nowrap;
      overflow-x: scroll;
    }

    .scroll-item {
      width: 6.4rem;
      display: inline-block;
      margin-right: 0.525rem;
      /*padding-right: 0.5rem;*/
      border-radius: 10px;
      background: #FFFFFF;
    }

    .scroll .img {
      width: 6.4rem;
      /*padding-left: 0.425rem;*/
      height: 3rem;
      margin-bottom: 0.17rem;
    }

    .you {
      display: flex;
      justify-content: space-between;
      /* align-items: center; */
      margin-bottom: 0.275rem;
    }

    .duo {
      width: 2.2rem;
      height: 0.65rem;
      background: #F96B47;
      display: flex;
      justify-content: space-around;
      align-items: center;
      font-size: 0.45rem;
      color: #FFFFFF;
      font-weight: 500;
    }

    .ren1 {
      font-size: 0.45rem;
      color: #999999;
      font-weight: 500;
      padding-right: 0.5rem;
    }

    .fixed-bottom {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 48px;
      background: white;
      box-shadow: 0 -0.02rem 0.1rem 0 rgba(222, 228, 234, 0.8);
      padding: 0 15px;
    }

    .fixed-bottom img {
      width: 34px;
      height: 34px;
    }

    .fixed-bottom .info {
      flex: 1;
      display: flex;
      flex-flow: column;
      justify-content: space-between;
      height: 34px;
      margin-left: 10px;
    }

    .info .info-top {
      color: #3B3B3B;
      font-size: 13px;
    }

    .info .info-bottom {
      color: #989898;
      font-size: 11px;
    }

    .btn-download {
      width: 70px;
      height: 29px;
      text-align: center;
      line-height: 29px;
      background: #F96B47;
      border-radius: 14.5px;
      color: #FFFFFF;
      font-size: 12px;
    }
  </style>
</head>
<body>
<div id="app" v-cloak="">
  <!--  轮播图-->
  <div class="swiper-container swiper-container1" id="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide" v-for="car in carousel">
        <img :src="car  | ossImgSuffix(5)" alt="" onload="bannerImgLoader()">
      </div>
    </div>
  </div>
  <div class="btn-group">
    <div class="btn-top">
      <div class="item item1" @click="IntegralIndiana()">
        <div class="icon-hot"></div>
        <div class="title">积分夺宝</div>
        <div class="sub-title">用积分中超级大奖</div>
        <div class="name">我的中奖码
          <div class="icon-red"></div>
        </div>
        <img src="/static/admin/jingtaiwu/main1/img1.png" alt="" class="img1">
        <img src="/static/admin/jingtaiwu/main1/img3.png" alt="" class="img2">
      </div>
      <div class="item item2" @click="FullEntrepreneurship()">
        <div class="title">全民创业</div>
        <div class="sub-title">创业投资新渠道 全民参与</div>
        <div class="name">我有好项目</div>
        <img src="/static/admin/jingtaiwu/main1/img2.png" alt="" class="img3">
      </div>
    </div>
    <div class="btn-bottom">
      <div class="item item3" onclick="SOF()">
        <div class="title">社交圈</div>
        <div class="sub-title">社交 从这里开始</div>
        <img src="/static/admin/jingtaiwu/main1/img5.png" alt="" class="img4">
      </div>
      <div class="item item4" @click="claify()">
        <div class="title">积分兑换</div>
        <div class="sub-title">免费带走所爱</div>
        <img src="/static/admin/jingtaiwu/main1/img4.png" alt="" class="img5">
      </div>
      <div class="item item5" @click="ShopAround()">
        <div class="title">同城购物</div>
        <div class="sub-title">一次消费 二次受益</div>
        <img src="/static/admin/jingtaiwu/main1/img6.png" alt="" class="img6">
      </div>
    </div>
  </div>
  <div class="swiper-container swiper-container2 banner swiper-no-swiping">
    <div class="swiper-wrapper">
      <div class="swiper-slide" v-for="info in winningInformation">
        <div class="left"><img src="/static/admin/jingtaiwu/main1/jfzj.png" alt="" style="width: 1.25rem;height: 1.43rem"></div>
        <div class="info">
          <img :src="info.user_image | ossImgSuffix(3)" alt="" class="avatar left">
          <div class="main left">
            <div class="name">{{info.user_username}}</div>
            <div class="event">{{info.w_info}}</div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!--  1F-->
  <div class="product-list">
    <div class="title-bar">
      <div class="left">
        <span class="index">1F&ensp;</span>
        <span class="hr"></span>
        <span class="name">&ensp;今天特惠</span>
      </div>
      <div class="right" @click="more('1')">
        <span>更多</span>
        <div class="icon-right"></div>
      </div>
    </div>
    <div class="list">
      <div class="item" v-for=" day in today" @click="commodityDetails(day.p_id)">
        <img :src="day.p_banner.split(',')[0] | ossImgSuffix(1)" alt="" class="product-img" :style="style1">
        <div class="price aui-ellipsis" v-if="day.p_type == '2'">{{day.p_jifen_price}}积分</div>
        <div class="price aui-ellipsis" v-if="day.p_type == '3'">￥{{day.p_now_price}} + {{day.p_jifen_price}}积分</div>
        <div class="desc">{{day.p_name}}</div>
      </div>
    </div>
  </div>
  <!--  2F-->
  <div class="product-list" style="margin-bottom: 0.2rem">
    <div class="title-bar">
      <div class="left">
        <span class="index">2F&ensp;</span>
        <span class="hr"></span>
        <span class="name">&ensp;同城特惠</span>
      </div>
      <div class="right" @click="more('2')">
        <span>更多</span>
        <div class="icon-right"></div>
      </div>
    </div>
    <div class="list2">
      <div class="item" v-for=" cityList in city" @click="commodityDetails(cityList.p_id)">
        <img :src="cityList.p_banner.split(',')[0] | ossImgSuffix(1)" alt="" class="product-img" :style="style2">
        <div class="price aui-ellipsis" v-if="cityList.p_type == '2'">{{cityList.p_jifen_price}}积分</div>
        <div class="price aui-ellipsis" v-else-if="cityList.p_type == '3'">￥{{cityList.p_now_price}} + {{cityList.p_jifen_price}}积分</div>
        <div class="desc aui-ellipsis-1">{{cityList.p_name}}</div>
      </div>
    </div>
  </div>
  <div class="scroll">
    <div class="scroll-area">
      <div class="scroll-item" v-for="(ro,index) in roll" @click="linK(ro)">
        <div class="you">
          <div class="duo">
            <span>{{ro.ad_left_title}}</span>
          </div>
          <span class="ren1">{{ro.ad_right_title}}</span>
        </div>
        <img :src="ro.ad_img | ossImgSuffix(5)" class="img">
      </div>
    </div>
  </div>
  <!--  3F-->
  <div class="product-list" style="margin-bottom: 0.2rem">
    <div class="title-bar">
      <div class="left">
        <span class="index">3F&ensp;</span>
        <span class="hr"></span>
        <span class="name">&ensp;人气推荐</span>
      </div>
      <div class="right" @click="more('3')">
        <span>更多</span>
        <div class="icon-right"></div>
      </div>
    </div>
    <div class="list">
      <div class="item" v-for="(man,index) in manList" @click="commodityDetails(man.p_id)">
        <img :src="man.p_banner.split(',')[0] | ossImgSuffix(1)" alt="" class="product-img" :style="style1">
        <div class="price aui-ellipsis" v-if="man.p_type == '2'">{{man.p_jifen_price}}积分</div>
        <div class="price aui-ellipsis" v-if="man.p_type == '3'">￥{{man.p_now_price}} + {{man.p_jifen_price}}积分</div>
        <div class="desc aui-ellipsis">{{man.p_name}}</div>
      </div>
    </div>
  </div>
  <div class="scroll">
    <div class="scroll-area">
      <div class="scroll-item" v-for="(ro,index) in roll2" @click="linK(ro)">
        <div class="you">
          <div class="duo">
            <span>{{ro.ad_left_title}}</span>
          </div>
          <span class="ren1">{{ro.ad_right_title}}&emsp;</span>
        </div>
        <img :src="ro.ad_img | ossImgSuffix(5)" class="img">
      </div>
    </div>
  </div>
  <!--  4F-->
  <div class="product-list">
    <div class="title-bar">
      <div class="left">
        <span class="index">4F&ensp;</span>
        <span class="hr"></span>
        <span class="name">&ensp;同城店铺</span>
      </div>
      <div class="right" @click="ShopAround()">
        <span>更多</span>
        <div class="icon-right"></div>
      </div>
    </div>
    <div class="list3">
      <div class="item underLine" v-for="shop in shopList" @click="shopDe(shop.shop_id)">
        <img :src="shop.shop_img  | ossImgSuffix(1)" alt="" class="product-img" onerror="this.src='/static/admin/jingtaiwu/main1/logo1.png'">
        <div class="info">
          <div class="price">{{shop.shop_name}}</div>
          <div class="desc  aui-ellipsis">{{shop.shop_introduce}}</div>
        </div>
        <div class="right">
          <div class="top">
            <img src="/static/admin/jingtaiwu/main1/location2.png" alt="">
            <span>{{shop.distance}}km</span>
          </div>
          <div class="shop_browse">{{shop.shop_browse}}人进店</div>
          <div class="btn">进店逛逛</div>
        </div>
      </div>
    </div>
  </div>
  <div class="space" style="height: 58px"></div>
  <div class="fixed-bottom">
    <img src="https://jintianjifen.oss-cn-shanghai.aliyuncs.com/f53953806ed6e7296fc76890aff4b7c9.jpg" alt="">
    <div class="info">
      <div class="info-top">支分宝</div>
      <div class="info-bottom">支分宝享品质生活</div>
    </div>
    <div class="btn-download" onclick="tz()">立即下载</div>
  </div>
</div>
</body>
<script type="text/javascript" src="/static/admin/jingtaiwu/api.js"></script>
<script type="text/javascript" src="/static/admin/jingtaiwu/utils.js"></script>
<script type="text/javascript" src="/static/admin/jingtaiwu/jquery.min.js"></script>
<script type="text/javascript" src="/static/admin/jingtaiwu/swiper.min.js"></script>
<script src="/static/admin/jingtaiwu/vue.min.js"></script>
<script src="/static/admin/jingtaiwu/vue-extend.js"></script>
<script type="text/javascript" src="/static/admin/jingtaiwu/common1.js"></script>
<script>
  var vm;
  var address = {
    qu: getQueryVariable('qu') || 1197,
    lat: getQueryVariable('lat') || 39.95145,
    lon: getQueryVariable('lon') || 116.489931
  };
  window.onload = function () {
    vm = new Vue({
      el: '#app',
      data: {
        carousel: {},
        winningInformation: {},
        today: {},
        city: {},
        manList: {},
        imgM: "/static/admin/jingtaiwu/main1/logo1.png",
        shopList: [],
        roll: [],
        roll2: [],
        tabList: [],
        style1: {
          height: '6.1rem'
        },
        style2: {
          height: '6.1rem'
        }
      },
      methods: {
        // 广告跳转
        linK: function (ro) {
        },
        // 跳转周围店铺列表
        ShopAround: function () {
        },
        // 下单
        apiuserdoMathBtn: function () {
        },
        // 店铺详情
        commodityDetails: function (type) {
        },
        // 商品详情
        shopDe: function (type) {
        },
        // 更多
        more: function (type) {
        },
        // 全民创业
        FullEntrepreneurship: function () {
        },
        // 积分夺宝
        IntegralIndiana: function () {
        },
        // 商品列表以及以及周围店铺
        specialStar: function () {
          var _self = this;
          var data = {
            values: {
              qu: address.qu,
              lat: address.lat,
              lon: address.lon
            }
          };
          postAjax(ApiUrl.apiusertjGoods, data, function (ret, err) {
            if (ret) {
              _self.today = ret.msg.today;
              _self.city = ret.msg.city;
              _self.manList = ret.msg.man;
              _self.shopList = ret.msg.shop;
              // 动态修改图片为正方形
              _self.$nextTick(function () {
                // 动态修改商品详情缩略图为正方形
                var img = $api.offset($api.dom('.product-list .list .product-img'));
                if (img) {
                  _self.style1.height = img.w + 'px';
                }
                var img2 = $api.offset($api.dom('.product-list .list2 .product-img'));
                if (img2) {
                  _self.style2.height = img2.w + 'px';
                }
              });
            } else {
              console.log(JSON.stringify(err));
            }
          });
        },
        // 广告位1
        apiusergetAdvertiseList: function () {
          var _self = this;
          var data = {
            values: {
              port: 1,
              qu: address.qu,
              postion: 1
            }
          };
          postAjax(ApiUrl.apiusergetAdvertise, data, function (ret, err) {
            if (ret) {
              _self.roll = ret.msg;
            }
          });
        },
        // 广告位2
        apiusergetAdvertiseList1: function () {
          var _self = this;
          var data = {
            values: {
              port: 1,
              qu: address.qu,
              postion: 2
            }
          };
          postAjax(ApiUrl.apiusergetAdvertise, data, function (ret, err) {
            if (ret) {
              _self.roll2 = ret.msg;
            }
          });
        },
        // 获奖列表
        winningInformationStar: function () {
          var _self = this;
          var data = {
            values: {
              values: data
            }
          };
          postAjax(ApiUrl.apiusergetgetWinInfo, data, function (ret, err) {
            if (ret) {
              for (i in ret.msg) {
                if (ret.msg[i].user_image == null) {
                  ret.msg[i].user_image = _self.imgM;
                }
              }
              _self.winningInformation = ret.msg;
              _self.$nextTick(function () {
                if (!_self.mySwiper1) {
                  _self.mySwiper1 = new Swiper('.swiper-container2', {
                    loop: true,
                    slidesPerView: "auto",
                    direction: 'vertical',
                    loopAdditionalSlides: 1,
                    speed: 600,
                    autoplay: {
                      disableOnInteraction: false, //手动滑动之后不打断播放
                      delay: 2000
                    },
                    pagination: {
                      el: '.swiper-pagination'
                    },
                    on: {}
                  });
                }

              });
            } else {

            }
          });
        },
        // 分类
        claify: function () {
        },
        // 获取轮播图
        carouselStar: function () {
          var _self = this;
          var data = {
            values: {
              area: address.qu
            }
          };
          postAjax(ApiUrl.apiusergetBanner, data, function (ret, err) {
            if (err) {
              return;
            }
            if (ret.status == '200') {
              _self.carousel = ret.msg;
              _self.$nextTick(function () {
                if (!_self.mySwiper2) {
                  _self.mySwiper2 = new Swiper('.swiper-container1', {
                    loop: true,
                    slidesPerView: "auto",
                    observer: true,
                    observeParents: false,
                    observeSlideChildren: true,
                    loopAdditionalSlides: 1,
                    speed: 3000,
                    autoplay: {
                      disableOnInteraction: false, //手动滑动之后不打断播放
                      delay: 2000
                    },
                    pagination: {
                      el: '.swiper-pagination'
                    },
                    on: {}
                  });

                } else {
                  _self.mySwiper2.update();
                }

              });
            } else {
              console.log(JSON.stringify(err));
            }
          });
        }
      },
      filters: {
        // 富文本过滤
        richtextformat: function (value) {
          if (!value) return '暂无介绍';
          var arr = value.split(',,,,,');
          var arr1 = [];
          arr.forEach(function (value1) {
            if (value1.indexOf('<div>') == 0) {
              var str = value1.match(/<div>(\S*)<\/div>/)[1];
              arr1.push(str);
            }
          });
          return arr1.length > 0 ? arr1.join(',') : '暂无介绍';
        }
      },
      mounted: function () {
        this.winningInformationStar();
        this.carouselStar();
        this.apiusergetAdvertiseList();
        this.apiusergetAdvertiseList1();
        this.specialStar();
      }
    });
  };

  function bannerImgLoader() {
    $api.dom('.swiper-container1').style.height = $api.offset($api.dom('.swiper-container1 img')).h + 'px';
  }

  function SOF() {

  }

  function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i = 0; i < vars.length; i++) {
      var pair = vars[i].split("=");
      if (pair[0] == variable) {
        return pair[1];
      }
    }
    return false;
  }

  function tz() {
    if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
      var loadDateTime = new Date();
      window.setTimeout(function () {
        var timeOutDateTime = new Date();
        if (timeOutDateTime - loadDateTime < 5000) {
          window.location = 'itms-apps://itunes.apple.com/cn/app/wei/id1468418168';
        } else {
          window.close();
        }
      }, 300);
    } else {
      window.setTimeout(function () {
        window.location.href = 'https://csdl.jintianjifen.cn/zhifenbao.apk';
      }, 300);
    }
  }
</script>
</html>
